<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>detail</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/04-detail.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2790924_w8n6lvvnf6.css">
    <link rel="stylesheet" href="../lib/css/common.css">
    <link rel="stylesheet" href="../lib/css/normalize.css">
    <link rel="stylesheet" href="../lib/css/bootstrap.css">
    <script src="../lib/cookie.js"></script>
    <script src="../lib/ajax.js"></script>
    <script src="../lib/jquery.min.js"></script>
    <script src="../lib/bootstrap.js"></script>
    <script src="../lib/layer/layer.js"></script>
</head>

<body>
    <div id="detail">
        <!-- 顶部DIV -->
        <div class="topDiv">
            <div class="topDiv-con">
                <div class="top_leftDiv">
                    <ul>
                        <a href="javascript:;" class="pointer">
                            <li style="padding-left: 0px;background: url('')">小米商城</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>MIUI</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>loT</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>云服务</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>天星数科</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>有品</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>小爱开放平台</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>企业团购</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>资质证照</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>协议规则</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>下载app</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>智能生活</li>
                        </a>
                        <a href="javascript:;" class="pointer">
                            <li>Select Location</li>
                        </a>
                    </ul>
                </div>
                <div class="top_rightDiv">
                    <ul>
                        <a href="01-login.html" class="pointer">
                            <li style="padding-left:0px;background: url('')">登录</li>
                        </a>
                        <a href="02-register.html" class="pointer">
                            <li>注册</li>
                        </a>
                    </ul>
                    <a href="03-shoppingCart.html" class="pointer">
                        <div class="top_rightDiv_lable">
                            <i class="iconfont icon-gouwuche2" style="font-size: 18px"></i> &nbsp;
                            <p>购物车</p>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <!-- 导航区 -->
        <div class="itemNavDiv">
            <div class="itemNavDiv-top">
                <a href="javascript:;">
                    <img src="../images/xiaomiguanwangtu.png" alt="">
                </a>

                <div class="item-center">
                    <a href="javascript:;" class="pointer">
                        <li>小米手机</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>Redmi红米</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>电视</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>笔记本</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>平板</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>家电</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>路由器</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>智能硬件</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>服务</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>社区</li>
                    </a>

                </div>
                <div class="item-right">
                    <select name="" id="">
                        <option value="">全部商品</option>
                        <option value="">充电宝</option>
                        <option value="">小米平板5 Pro</option>
                        <option value="">黑鲨4S</option>
                        <option value="">笔记本</option>
                        <option value="">洗手液</option>
                        <option value="">耳机</option>
                        <option value="">手机</option>
                    </select>
                    <div class="iconfont icon-search" id="item-icon"></div>
                </div>
            </div>
            <!-- 购物车悬浮 -->
            <div id="shopNavRightDiv">
                <div class="shopNav">
                    <div class="shopNavLeft">
                        <p></p>
                        <a href="javascript:;"></a>
                    </div>
                    <div class="shopNavRight">
                        <ul>
                            <li>
                                <a href="index.html">列表页</a>
                            </li>
                            <li>
                                    <a href="index.html">首页</a>
                                </li>
                            <li style="background: url('')">
                                <a href="javascript:;">用户评价</a>
                            </li>
                        </ul>
                        <a href="index.html" style=" text-decoration: none;color: #fafafa;"><p>立即购买</p></a> 
                    </div>
                </div>
            </div>
        </div>
        <!--商品详情区  -->
        <div class="goodsDetail">
            <!-- 放大镜 -->
            <div id="enlarge">
                <div class="displayArea">
                    <img class="displayAreaImg" src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/6d0a3e7acc3e91e2cfd83dbbe1d1c029.jpg?thumb=1&w=200&h=200&f=webp&q=90"
                        alt="">
                    <div class="shade"></div>
                </div>
                <div class="enlargedArea">
                    <img class="enlargedAreaImg" src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/6d0a3e7acc3e91e2cfd83dbbe1d1c029.jpg?thumb=1&w=200&h=200&f=webp&q=90"
                        alt="">
                </div>
            </div>
            <div class="tableImg">  
                <img src="" alt="">
            </div>

            <!-- 商品信息 -->
            <div class="description">
                <h4>标题</h4>
                <p class="free">免息</p>
                <div class="price">
                    <p class="souceprice">价格：￥
                        <span>000</span>元</p>
                    <p class="coupon" style="margin-top: 0px;">优惠券：
                        <span>满减</span>
                    </p>
                </div>
                <div class="news">
                    <p style="color: black">其他商品信息</p>
                </div>
                <div class="addCart">
                    <div class="number">
                        <input type="text" name="num" value=1 id="num">
                        <button class="add">+</button>
                        <button class="reduce">-</button>
                    </div>
                    <button class="addBtn" stock='10'>加入购物车</button>
                    <a href="03-shoppingCart.html" class="toCart" style="text-decoration: none">进入购物车</a>
                </div>
            </div>
            <!-- 猜你喜欢 -->
            <div class="guess">
                <h3>猜你喜欢</h3>
                <ul>
                    <li>
                        <img width="180" src="https://img10.360buyimg.com/n1/s150x150_jfs/t1/130598/20/15852/147760/5fae5664E6d66a09c/ee060d4630968d60.jpg"
                            alt="">
                        <p>描述</p>
                        <span>￥2480元</span>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 推荐爆款 -->
        <div class="wrap recommend">
            <div class="content">
                <h3>推荐爆款</h3>
                <ul class="clearfix">
                </ul>
            </div>
        </div>
        <!-- 服务区域 -->
        <div class="serveDiv">
            <div class="serveDiv-top">
                <div>
                    <ul>
                        <li>
                            <a href="javascript:;">
                                <i class="iconfont icon-weixiu"></i> 预约维修服务</a>
                        </li>
                    </ul>
                </div>
                <div>
                    <ul>
                        <li>
                            <a href="javascript:;">
                                <i class="iconfont icon-7tian"></i> 7天无理由退货</a>
                        </li>
                    </ul>
                </div>
                <div>
                    <ul>
                        <li>
                            <a href="javascript:;">
                                <i class="iconfont icon-15tianmianfeihuanhuo24px"></i> 15天免费换货</a>
                        </li>
                    </ul>
                </div>
                <div>
                    <ul>
                        <li>
                            <a href="javascript:;" style="padding-left: 25px">
                                <i class="iconfont icon-baoyou"></i> 满69包邮</a>
                        </li>
                    </ul>
                </div>
                <div style="border: 0;">
                    <ul>
                        <li>
                            <a href="javascript:;">
                                <i class="iconfont icon-icon-yijidaohang-wangdianguanli"></i> 520余家售后网点</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="serveDiv-bottom">
                <div class="serveDivBottom-left">
                    <ul>
                        <span>帮助中心</span>
                        <li>
                            <a href="javascript:;">账户管理</a>
                        </li>
                        <li>
                            <a href="javascript:;">购物指南</a>
                        </li>
                        <li>
                            <a href="javascript:;">订单操作</a>
                        </li>
                    </ul>
                    <ul>
                        <span>服务支持</span>
                        <li>
                            <a href="javascript:;">售后政策</a>
                        </li>
                        <li>
                            <a href="javascript:;">自助服务</a>
                        </li>
                        <li>
                            <a href="javascript:;">相关下载</a>
                        </li>
                    </ul>
                    <ul>
                        <span>线下门店</span>
                        <li>
                            <a href="javascript:;">小米之家</a>
                        </li>
                        <li>
                            <a href="javascript:;">服务网点</a>
                        </li>
                        <li>
                            <a href="javascript:;">授权体验店/专区</a>
                        </li>
                    </ul>
                    <ul>
                        <span>关于小米</span>
                        <li>
                            <a href="javascript:;">了解小米</a>
                        </li>
                        <li>
                            <a href="javascript:;">加入小米</a>
                        </li>
                        <li>
                            <a href="javascript:;">投资者关系</a>
                        </li>
                        <li>
                            <a href="javascript:;">企业社会责任</a>
                        </li>
                        <li>
                            <a href="javascript:;">廉洁举报</a>
                        </li>
                    </ul>
                    <ul>
                        <span>关注我们</span>
                        <li>
                            <a href="javascript:;">新浪微博</a>
                        </li>

                        <li>
                            <a href="javascript:;">官方微信</a>
                        </li>
                        <li>
                            <a href="javascript:;">联系我们</a>
                        </li>
                        <li>
                            <a href="javascript:;">公益基金会</a>
                        </li>
                    </ul>
                    <ul style="padding-right: 100px;">
                        <span>特色服务</span>
                        <li>
                            <a href="javascript:;">F码通道</a>
                        </li>
                        <li>
                            <a href="javascript:;">礼物码</a>
                        </li>
                        <li>
                            <a href="javascript:;">防伪查询</a>
                        </li>
                    </ul>
                </div>
                <div class="serveDivBottom-right">
                    <div>
                        <h3>400-100-5678</h3>
                        <p>8:00-18:00 (仅收市话费)</p>
                        <h6>
                            <i class="iconfont icon-rengongkefu"></i> 人工客服</h6>
                        <span>关注小米:
                            <img src="../images/789456.png" alt="">
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <!-- 底部DIV -->
        <div class="bottomDiv">
            <div cla></div>
            <img src="../images/xiaomiguanwangtu.png" alt="">
            <div class="bottomDiv-right">
                <ul>
                    <a href="javascript:;" class="pointer">
                        <li style="padding-left: 0px">小米商城</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>MIUI</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>米家</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>米聊</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>多看</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>游戏</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>政企服务</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>小米天猫店</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>小米集团隐私政策</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>小米公司儿童信息保护规则|</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>小米商城隐稳私政策</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>小米商城用户协议</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>问题反馈</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li style="background: url()">Select Localion</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li style="padding-left: 0">北京互联网法院法律服务工作站</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li></li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li>中国消费者协会</li>
                    </a>
                    <a href="javascript:;" class="pointer">
                        <li style="background: url()">北京市消费者协会</li>
                    </a>
                </ul>
                <div class="bottomDiv-ol">
                    <ol>
                        <li>
                            <a href="javascript:;">&copy; mi.com</a>京ICP证110507号</li>
                        <li>
                            <a href="javascript:;">京ICP备10046444号</a>
                        </li>
                        <li>
                            <a href="javascript:;">京公网安备11010802020134号</a>
                        </li>
                        <li>
                            <a href="javascript:;"> 京网文[2020]0276-042号</a>
                        </li>
                    </ol>
                    <ol>
                        <li>
                            <a href="javascript:;"> (京）网械平台备字(2018）第00005号</a>
                        </li>
                        <li>
                            <a href="javascript:;">互联网药品信息服务资格证(京)-非经营性-2014-0090</a>
                        </li>
                        <li>
                            <a href="javascript:;">营业执照</a>
                        </li>
                        <li>
                            <a href="javascript:;">医疗器械质量公告</a>
                        </li>
                    </ol>
                    <ol>
                        <li>
                            <a href="javascript:;">增值电信业务许可证</a>
                        </li>
                        <li>
                            网络食品经营备案
                        </li>
                        <li>
                            京食药网食备202010048
                        </li>
                        <li>
                            <a href="javascript:;">食品经营许可证</a>
                        </li>
                    </ol>
                    <ol>
                        <li>违法和不良信息举报电话: 171-5104-4404</li>
                        <li>
                            <a href="javascript:;">知识产权侵权</a>
                        </li>
                        <li>投诉本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</li>
                    </ol>
                    <div class="bottomDiv-bottom">
                        <img src="../images/bottom_imgs/truste.png" alt="">
                        <img src="../images/bottom_imgs/v-logo-2.png" alt="">
                        <img src="../images/bottom_imgs/icon3.png" alt="">
                        <img src="../images/bottom_imgs/02.png" alt="">
                        <img src="../images/bottom_imgs/01.png" alt="">
                    </div>
                    <p>让全球每个人都能享受科技带来的美好生活</p>
                </div>
            </div>
        </div>
</body>

</html>
<script src="../js/05-enlarge.js"></script>
<script src="../js/06-checkLogin.js"></script>
<script src="../js/04-detail.js"></script>